/**
 * 功能：展示申请单被关联的单据
 * 适用：该申请单被关联于哪些借款单，哪些报销单
 */
import {messages, queryCurrencyPrecision} from "share/common";
import React from 'react'
import { connect } from 'react-redux'
import menuRoute from 'routes/menuRoute'
import { Icon, message } from 'antd'
import errorMessage from 'share/errorMessage';
import requestService from 'containers/request/request.service'

class RelatedShowList extends React.Component{
  constructor(props) {
    super(props);
    this.state = {
      referLoanBills: [], //关联的借款单（不包括创建申请单时生成的借款单的）
      referExpenseReports: [] //关联的报销单
    };
    this.loanDetail = menuRoute.getRouteItem('loan-detail','key'); //借款单详情页
    this.expenseReportDetail = menuRoute.getRouteItem('expense-report-detail','key'); //报销单详情页
  }

  componentDidMount() {
    this.getRelatedList();
  };

  getRelatedList = () => {
    const { info } = this.props;
    requestService.getRelatedList(info.applicationOID).then(res => {
      if (res.data && res.data.rows) {
        this.setState({
          referLoanBills: res.data.rows['referLoanBills'] || [],
          referExpenseReports: res.data.rows['referExpenseReports'] || []
        });
      }
    }).catch(e => {
      errorMessage(e.response);
    });
  };

  toGoLoanDetail = (loanBill) => {
    let url = this.loanDetail.url.replace(':formOID', loanBill.formOID).replace(':loanBillOID', loanBill.entityOID);
    if (window.ISIE9) {
      url = `#${url}`;
    }
    window.open(url);
  };

  toGoExpenseReportDetail = (expenseReport) => {
    let url = this.expenseReportDetail.url.replace(':expenseReportOID', expenseReport.entityOID);
    if (window.ISIE9) {
      url = `#${url}`;
    }
    window.open(url);
  };

  render() {
    const { referLoanBills, referExpenseReports } = this.state;
    return (
      <div>
        {!!referLoanBills.length && (
          <div className="row-container">
            <span>{messages('request.key624')/*关联借款*/}：</span>
            {referLoanBills.map((loanBill, loanBillIndex) => {
              return (
                <span>
                  {loanBillIndex !== 0 && (<span>&nbsp;&nbsp;&nbsp;</span>)}
                  <Icon type="link" className="link-icon"/>
                  <a onClick={() => this.toGoLoanDetail(loanBill)}>{loanBill.businessCode}</a>
                </span>
              )
            })}
          </div>
        )}
        {!!referExpenseReports.length && (
          <div className="row-container">
            <span>{messages('request.key625')/*关联报销*/}：</span>
            {referExpenseReports.map((expenseReport, expenseReportIndex) => {
              return (
                <span>
                  {expenseReportIndex !== 0 && (<span>&nbsp;&nbsp;&nbsp;</span>)}
                  <Icon type="link" className="link-icon"/>
                  <a onClick={() => this.toGoExpenseReportDetail(expenseReport)}>{expenseReport.businessCode}</a>
                </span>
              )
            })}
          </div>
        )}
      </div>
    )
  }
}

RelatedShowList.propTypes = {
  info: React.PropTypes.object
};

RelatedShowList.defaultProps={
  info: {}
};

RelatedShowList.contextTypes = {
  router: React.PropTypes.object
};

function mapStateToProps() {
  return { }
}

export default connect(mapStateToProps)(RelatedShowList)
